<template>
  <view class="flex-col page">
    <image class="self-center image" src="../../static/wx/ok.png" />
    <!-- <image class="self-center image" src="../../static/wx/on.png" /> -->
    <view class="flex-col items-center self-stretch group">
      <text class="text">成功</text>
      <text class="mt-24 font text_2">谢谢，您的订单已成功下单。</text>
    </view>
    <view class="flex-col justify-start items-center self-stretch text-wrapper">
      <text class="font text_3">继续</text>
    </view>
    <view class="mt-20 flex-col justify-start items-center text-wrapper_2">
      <text class="font text_4">查看订单</text>
    </view>
  </view>
</template>

<script>
export default {
  components: {},
  props: {},
  data() {
    return {};
  },

  methods: {},
};
</script>

<style scoped lang="css">
.page {
  padding: 244rpx 152rpx 798rpx;
  background-color: #ffffff;
  width: 100%;
  overflow-y: auto;
  overflow-x: hidden;
  height: 100%;
}
.image {
  width: 200rpx;
  height: 200rpx;
}
.group {
  margin-top: 68rpx;
}
.text {
  color: #2d3142;
  font-size: 48rpx;
  font-family: Laila;
  font-weight: 700;
  line-height: 45.12rpx;
}
.font {
  font-size: 32rpx;
  font-family: Mukta;
  line-height: 30.3rpx;
}
.text_2 {
  color: #2d3142;
}
.text-wrapper {
  margin-top: 80rpx;
  padding: 40rpx 0 44rpx;
  background-color: #3a7beb;
  border-radius: 32rpx;
  box-shadow: 0rpx 8rpx 30rpx #fd878733;
}
.text_3 {
  color: #ffffff;
  font-weight: 600;
  line-height: 29.82rpx;
}
.text-wrapper_2 {
  padding: 40rpx 0;
  background-color: #e6e9f1;
  border-radius: 32rpx;
}
</style>